<template>
  <el-dialog
    title="可可商城-用户协议"
    :visible.sync="dialogVisible"
    :before-close="cancel"
    top="2%"
    width="96%">
    <div class="content-outer my-scroller" :style="frameStyle">
      <div  v-html="content"></div>
      <div style="padding-top: 10px;">
        <label for=""><el-checkbox @change="changePrivacyAgreement" v-model="isAgreenPrivacyAgreement"/> 同意</label> <a href="javascript:void(0)" @click="showPrivacyAgreementDialog">《可可商城-隐私协议》</a>

      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="cancel">拒绝</el-button>
      <el-button type="primary" @click="confirm">同意</el-button>
    </div>
    <my-privacy-agreement-dialog ref="my-privacy-agreement-dialog" />
  </el-dialog>
</template>

<script>
import MyPrivacyAgreementDialog from './MyPrivacyAgreementDialog'
export default {
  name: 'MyAppAgreementDialog',
  components: {MyPrivacyAgreementDialog},
  data:function () {
    return {
      dialogVisible:false,
      content:'',
      isAgreenPrivacyAgreement:false,
      frameStyle:{
        width:'95%',
        height:(this.getWinSize().height-200)+'px'
      }
    }
  },
  mounted () {
    let $this=this
    $this.bus.$on('MyPrivacyAgreementCallBus',function () {
      let isAgree=localStorage.getItem("MyPrivacyAgreement")
      $this.isAgreenPrivacyAgreement=isAgree
      // console.log('$this.isAgreenPrivacyAgreement',$this.isAgreenPrivacyAgreement)
      $this.$forceUpdate()
    })
  },
  methods:{
    changePrivacyAgreement:function () {
      if (this.isAgreenPrivacyAgreement){
        localStorage.setItem("MyPrivacyAgreement","1")
      }else{
        localStorage.removeItem("MyPrivacyAgreement")
      }
    },
    showPrivacyAgreementDialog:function () {
      this.$refs['my-privacy-agreement-dialog'].open(false)
    },
    open:function () {
      this.getContent()
    },
    getContent:function () {
      let $this=this
      $this.MyRequest($this.ApiDoNameMember+'Public/getAppAgreement',{},function (data) {
        $this.content=data
        $this.dialogVisible=true
        $this.$forceUpdate()
      })
    },
    // 取消后关闭应用
    cancel:function () {
      let $this=this
      $this.$message.warning('拒绝App使用协议,2秒后关闭应用')
      setTimeout(function () {
        if (typeof plus!=='undefined'){
          plus.runtime.quit()
        }
      },2000)
    },
    confirm:function () {
      if (!this.isAgreenPrivacyAgreement){
        return this.$message.warning('请先查看底部【可可商城-隐私协议】并同意')
      }
      localStorage.setItem("AppAgreement","1")
      this.$message.success('您选择【同意协议】,稍后重载应用..')
      setTimeout(function () {
        location.reload()
      },1000)
      // this.$forceUpdate()
    }
  }
}
</script>

<style scoped>
  .content-outer{
    line-height: 20px; font-size: 12px; text-align: left; text-indent: 20px; overflow-y: auto; overflow-x:hidden
  }
</style>
